<template>
    <view class="body">
        <view class="body-list" v-for="(item, index) in collectionList" @click="commodityUrl(item.productId)">
            <view class="orderInfo">
                <image style="width: 185rpx; height: 166rpx; margin-right: 10rpx" :src="url2 +item.mainImage"
                    mode="aspectFill"></image>
                <view class="info">
                    <view class="infoname">
                        <view class="tag">品牌</view>
                        <view class="name">{{item.productName}}</view>
                    </view>
                    <view class="Specifications">规格：已选到期归还，{{item.specifications}}</view>
                    <view class="price">
                        <text class="price-text">
                            {{item.minPrice}}
                            <span>/天</span>
                        </text>
                        <!-- <text class="text_99">99新</text> -->
                        <!-- <text class="text_99">{{item.remark}}</text> -->
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    import {
        onLoad
    } from "../../uni_modules/uview-ui/libs/mixin/mixin";
    import main from "@/api/main.js";
    import address from "@/api/address.js";
    import {
        baseUrl
    } from '../../config.js';
    export default {
        data() {
            return {
                dataSum: 0, //日租金
                url2: '',
                collectionList: [],
                orderList: []
            };


        },
        methods: {



            goodsDetail(id) {
                main.getIdClass(id).then((res) => {
                    if (res.code == 200) {
                        console.log("res.rows", res);
                    }
                    console.log("50=res", res);
                })
            },
            commodityUrl(id) {
                this.id = id;

                uni.navigateTo({
                    // 正确方式：使用 ${id} 插入变量
                    url: `/subPages/main/commodity?id=${id}`
                });
            },
            getCollectionList() {
                main.getCollectionList().then((res) => {
                    console.log("63=res=>", res);
                    if (res.code == 200) {
                        this.collectionList = res.rows;
                    }
                }).catch((erro) => {
                    console.log("error")
                });
            },
        },
        onLoad() {
            console.log("addressList", this.addressList);
            this.getCollectionList();
            setTimeout(() => {
                this.url2 = baseUrl;
            }, 500);
            // this.goodsDetail();
        }
    };
</script>

<style lang="scss" scoped>
    .body {
        margin: 20rpx;
        background-color: #f8f9ff;

        .body-list {
            margin-top: 35rpx;
            margin: 30rpx;
        }
    }

    .orderInfo {
        width: 100%;
        box-sizing: border-box;
        display: flex;
        padding: 30rpx;
        border-radius: 10rpx;
        background-color: #fff;

        .info {
            display: flex;
            flex-direction: column;
            justify-content: space-around;
        }

        .infoname {
            display: flex;
            align-items: center;

            .tag {
                width: 64rpx;
                height: 36rpx;
                line-height: 36rpx;
                text-align: center;
                color: #1677ff;
                background-color: #deecff;
                border-radius: 25px;
                font-size: 20rpx;
                margin-right: 8rpx;
            }

            .name {
                font-size: 28rpx;
            }

            .mode {
                width: 64rpx;
                height: 36rpx;
                line-height: 36rpx;
                text-align: center;
                color: #ff8662;
                border: 1px solid #ff8662;
                border-radius: 3px;
                font-size: 20rpx;
                margin-left: 15rpx;
            }
        }

        .Specifications {
            color: #777;
            font-size: 24rpx;
        }

        .price {
            .price-text {
                font-weight: 600;
                color: #1677ff;
                margin-right: 20rpx;

                span {
                    font-weight: 400;
                    font-size: 22rpx;
                }
            }

            .text_99 {
                font-size: 25rpx;
                border: 1px #ff8662 solid;
                color: #ff8662;
                border-radius: 5rpx;
                padding: 0 8rpx;
            }
        }
    }
</style>